<template>
	<div class="user_footer">
		<div class="fenge"></div>
		<div class="user_footer1">
			<div class="all_indent">全部订单</div>
			<div class="right">&gt;</div>
		</div>
		<div class="user_footer2">
			<div>
				<span></span>
				<p>待付款</p>
			</div>
			<div>
				<span></span>
				<p>代发货</p>
			</div>
			<div>
				<span></span>
				<p>待收货</p>
			</div>
			<div>
				<span></span>
				<p>待评价</p>
			</div>
		</div>
		<div class="user_footer3">
			<div class="user_footer3_1">
					<span></span>
					<div>购物车</div>
				<div class="right">&gt;</div>
			</div>
			<div class="user_footer3_1">
					<span></span>
					<div>我的会员</div>
				<div class="right">&gt;</div>
			</div>
			<div class="user_footer3_1">
				<span></span>
				<div>客服热线</div>
				<div class="right">&gt;</div>
			</div>
			<div class="user_footer3_1">
				<span></span>
				<div>我的上传</div>
				<div class="right">&gt;</div>
			</div>
			<div class="user_footer3_1">
				<span></span>
				<div>我的设置</div>
				<div class="right">&gt;</div>
			</div>
		</div>
		<div class="user_footer4"></div>
	</div>
</template>

<script>
	export default {
	  name: 'user_footer',
  data () {
    return {
      
    }
  }
}
</script>

<style scoped>
	.left{
		float: left;
	}
	.right{
		float: right;
	}
	.user_footer{
		width: 100%;
	}
	.user_footer .fenge{
		width: 100%;
		height: 0.5rem;
		background-color: #f4f3f0;
		border-top: 1px solid #c5c4c4;
		margin-top: 3rem;
	}
	.user_footer1{
		width: 90%;
		margin: auto;
		height: 3rem;
		line-height: 3rem;
		border-bottom: 1px solid #c5c4c4;
		overflow: hidden;
		padding: 0 5%;
	}
	.all_indent{
		float: left;
	}
	.right{
		font-size: 1.5rem;
	}
	.user_footer2{
		width: 80%;
		padding: 0 10%;
		margin-top: 1rem;
		margin-bottom: 1rem;
	
	}
	.user_footer2 div{
		width: 25%;
		float: left;
		display: inline-block;
		text-align: center;
		font-size: 0.9rem;
		color: #7e7e7e;
	}
	.user_footer2 div span{
		width: 36%;
		height: 2rem;
		display: inline-block;
		background-repeat: no-repeat;
		background-size: 100%;
	}
	.user_footer2 div:nth-of-type(1) span{
		width: 45%;
		background-image: url(../../../../static/icon/daifukuan.png);
	}
	.user_footer2 div:nth-of-type(2) span{
		width: 50%;
		background-image: url(../../../../static/icon/daifahuo.png);
	}
	.user_footer2 div:nth-of-type(3) span{
		background-image: url(../../../../static/icon/daoshouhuo.png);
	}
	.user_footer2 div:nth-of-type(4) span{
		background-image:url(../../../../static/icon/daipingjia.png);
	}
	.user_footer3{
		width: 100%;
	}
	.user_footer3  .user_footer3_1{
		overflow: hidden;
		width: 90%;
		height: 3rem;
		line-height: 3rem;
		border-top: 1px solid #c5c4c4;
		padding: 0 5%;
	}
	.user_footer3  .user_footer3_1 div{
		display: inline-block;
	}
	.user_footer3  .user_footer3_1 span{
		display: inline-block;
		background-repeat: no-repeat;
		background-size: 100%;
		width: 5%;
		height: 2rem;
		vertical-align:text-top;
		margin-right: 0.4rem;
	}
	.user_footer3 div:nth-of-type(1) span{
		background-image: url(../../../../static/icon/buycar.png);
	}
	.user_footer3 div:nth-of-type(2) span{
		background-image: url(../../../../static/icon/member.png);
	}
	.user_footer3 div:nth-of-type(3) span{
		background-image: url(../../../../static/icon/kefu.png);
	}
	.user_footer3 div:nth-of-type(4) span{
		background-image: url(../../../../static/icon/upload.png);
	}
	.user_footer3 div:nth-of-type(5) span{
		background-image: url(../../../../static/icon/set.png);
	}
	
	
	
	
	
	
	
	
	
	
	
	.user_footer4{
		width: 100%;
		height: 3.5rem;
	}
</style>